<template>
	<div class="index">
		<div class="center">
			<left></left>
			<div class="right">
          <top></top>

          <div class="hei10"></div>

          <div>
            <a href="http://xiaoluohao.vip/" target="_blank" >
              <img src="../../../static/img/xiaoluohao.jpg">
            </a>
          </div>

          <div class="hei10"></div>
          <div class="tongzhi kflexc">
            <div style="width: 30px;">
              <img src="../../../static/kuanping/xiaoxit.png" style="width: 20px; margin-right: 10px;">
            </div>
            <div style="flex-grow: 1;">
              <el-carousel height="40px" direction="vertical" :autoplay="true">
                    <el-carousel-item v-for="item in gonggaolist" :key="item.id">
                      <div v-html="item.content"></div>
                    </el-carousel-item>
                  </el-carousel>
            </div>
          </div>

          <div class="hei10"></div>

          <div class="flex">
            <div class="shuju">
              <div class="shujutitle kflexbc">
                <div class="kflexcc">
                  <div class="shuxian"></div>
                  实时数据
                </div>

                <div>{{tongji.time}}</div>
              </div>
              <div class="flex kflexcc" style="justify-content: space-around;">
                <div class="flex shujuli">
                  <div class="shujuliimg"><img src="https://file.storep.91haoka.cn/gantanhao/si1.png" style="width: 70px;"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">发展订单数</div>
                      <div class="zi2">{{tongji.today.orders_count}}</div>
                      <div class="zi3">昨日全天<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.orders_count}}</span></div>
                    </div>
                  </div>
                </div>
                <div class="flex shujuli">
                  <div class="shujuliimg"><img src="https://file.storep.91haoka.cn/gantanhao/si2.png" style="width: 70px;"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">审核通过订单数</div>
                      <div class="zi2">{{tongji.today.submit_count}}</div>
                      <div class="zi3">昨日全天 <span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.submit_count}}</span></div>
                    </div>
                  </div>
                </div>

                <!-- <div class="flex shujuli">
                  <div class="shujuliimg"><img src="../../../static/kuanping/shouye3.png"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">生产发货订单数</div>
                      <div class="zi2">{{tongji.today.deliver_count}}</div>
                      <div class="zi3">昨日全天<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.deliver_count}}</span></div>
                    </div>
                  </div>
                </div>
                <div class="flex shujuli">
                  <div class="shujuliimg"><img src="../../../static/kuanping/shouye4.png"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">外呼订单数</div>
                      <div class="zi2">{{tongji.today.call_order}}</div>
                      <div class="zi3">昨日全天<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.call_order}}</span></div>
                    </div>
                  </div>
                </div> -->

               <div class="flex shujuli">
                  <div class="shujuliimg"><img src="https://file.storep.91haoka.cn/gantanhao/si3.png" style="width: 70px;"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">提单成功订单数</div>
                      <div class="zi2">{{tongji.today.success_amount}}</div>
                      <div class="zi3">昨日全天<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.success_amount}}</span></div>
                    </div>
                  </div>
                </div>
                <div class="flex shujuli">
                  <div class="shujuliimg"><img src="https://file.storep.91haoka.cn/gantanhao/si4.png" style="width: 70px;"></div>
                  <div class="shujulicon flexc">
                    <div>
                      <div class="zi1">生产发货订单数</div>
                      <div class="zi2">{{tongji.today.deliver_count}}</div>
                      <div class="zi3">昨日全天<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{tongji.yesterday.deliver_count}}</span></div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="shuju2" style="position: relative;">
              <div class="shujutitle kflexc"><div class="shuxian"></div> {{moban.platform_name}}商城</div>
                  <div class="zi1" style="margin-top: 45px;">昨日下单：<span style="margin-left: 10px; color: #333;  font-size: 22px;font-family: 'shuziyong';">{{uvlist.order_count}}</span></div>
                  <div class="zi1" style="margin-top: 45px;">UV：<span style="margin-left: 10px; color: #333;  margin-right: 20px; font-size: 22px;font-family: 'shuziyong';">{{uvlist.UV}}</span>
                  PV：<span style="margin-left: 10px; color: #333;  font-size: 22px;font-family: 'shuziyong';">{{uvlist.PV}}</span></div>
                  <img   @click="gozhibo" src="../../../static/kuanping/youjiantou.png" style="position: absolute; right: 35px; top: 118px; width: 20px; cursor: pointer;">
            </div>
            <!-- <div class="shuju2" style="position: relative;">
               <div class="shujutitle kflexc"><div class="shuxian"></div> {{moban.platform_name}}靓号分销平台</div>
                  <div class="zi1" style="margin-top: 45px;">昨日下单：<span style="margin-left: 10px; color: #333; font-size: 22px;font-family: 'shuziyong';">{{uvlist2.yesterday_count}}</span></div>
                  <div class="zi1" style="margin-top: 45px;">订单数：<span style="margin-left: 10px; color: #333;  margin-right: 20px;font-size: 22px;font-family: 'shuziyong';font-family: 'shuziyong';">{{uvlist2.order_count}}</span>
                  销售额：<span style="margin-left: 10px; color: #333; font-size: 22px;font-family: 'shuziyong';">{{uvlist2.sales_count}}</span></div>
                  <img  @click="golianghao" src="../../../static/kuanping/youjiantou.png" style="position: absolute; right: 35px; top: 118px; width: 20px; cursor: pointer;">
            </div> -->
            <div class="shuju2" style="position: relative;"  >
               <div class="shujutitle kflexc"><div class="shuxian"></div>敢探号微信小程序</div>
                <div class="kflexcc" style="margin: 10px 0;">
                  <img src="../../../static/kuanping/xiaochengxulogo.png" style="width: 140px; display: block;">
                </div>
                <div style="color: rgb(51, 51, 51); text-align: center; font-size: 14px;"> 公测版现已上线，欢迎体验！</div>
            </div>
          </div>
           <div class="hei10"></div>
          <div class="flex">
            <div style="flex: 7; padding: 20px; height: 300px; overflow-y: auto;">
              <div class="kflexbc">
                <div class="kflexc">
                  <div class="shujutitle kflexc"><div class="shuxian"></div> 最近一周订单统计</div>
                  <div class="zi1" style="margin-left: 20px;">
                    发展订单数： <span style="margin-left: 10px; color: #333; font-size: 18px;  margin-right: 20px;font-family: 'shuziyong';">{{yizhoutongji.count.orders_count}}</span>
                    发货数：<span style="margin-left: 10px; color: #333; font-size: 18px; font-family: 'shuziyong';">{{yizhoutongji.count.deliver_count}}</span>
                  </div>
                </div>
                <div style="color: #0A82FF; cursor: pointer; font-size: 14px;" @click="go('/xinbaobiao')">详细数据 ></div>
              </div>

              <div id="main2" style="width: 100%; height: 250px; margin-top:10px;"></div>
            </div>
            <div style="flex: 4; padding: 20px; border-left: 10px #f4f4f4 solid; font-size: 14px; height: 300px; overflow-y: auto;">
              <div class="shujutitle kflexc"><div class="shuxian"></div> 店铺监控</div>
              <div class="kflexbc" style="padding: 10px 10px; margin-bottom: 10px;">
                <div style="font-weight: bold;">自动生产：</div>
                <div><!-- <el-button type="primary" size="mini">查看</el-button> --></div>
              </div>
              <div class="kflexbc" style="padding: 10px 10px; border-bottom: 1px #f4f4f4 solid;">
                <div style="color: #8A8A8A;" class="kflexc">
                  <div>自动生产提单异常：</div>
                  <div v-for="item in tongjishop.auto_exception" :key="item.id" style="color: #FF5E5E; margin-right: 10px; cursor: pointer; " @click="goid('/productionBasismanag/qudaodingdan',item.ID)">
                   [{{item.val}}]
                  </div>
                </div>
                <!-- <div><el-button type="primary" size="mini">处理</el-button></div> -->
              </div>
              <div class="kflexbc" style="padding: 10px 10px; border-bottom: 1px #f4f4f4 solid;">
                <div style="color: #8A8A8A;" class="kflexc">
                  <div>上游生产异常：</div>
                  <div v-for="item in tongjishop.upstream_exception" :key="item.id" style="color: #FF5E5E; margin-right: 10px; cursor: pointer; " @click="goid('/productionBasismanag/qudaodingdan',item.ID)">
                   [{{item.val}}]
                  </div>
                </div>
                <!-- <div><el-button type="primary" size="mini">处理</el-button></div> -->
              </div>
              <div class="kflexbc" style="padding: 10px 10px;">
                <div style="color: #8A8A8A;" class="kflex">
                  <div>订单回传数据异常：</div>
                  <div v-for="item in tongjishop.back_exception" :key="item.id" style="color: #FF5E5E; margin-right: 10px; cursor: pointer; " @click="goid('/productionBasismanag/qudaodingdan',item.ID)">
                    [{{item.val}}]
                  </div>
                </div>
                <div><!-- <el-button type="primary" size="mini">查看</el-button> --></div>
              </div>
              <div class="kflexbc" style="padding: 20px 10px; ">
                <div style="font-weight: bold;">抓单异常：<div v-if="!tongjishop.catch_exception" style="margin-top: 10px;">无</div></div>

                <div v-if="tongjishop.catch_exception"><!-- <el-button type="primary" size="mini">查看</el-button> --></div>
              </div>
              <div style="color: #FF5E5E; padding-left: 10px;">{{tongjishop.catch_exception}}</div>
            </div>
            <div style="flex: 6; border-left: 10px #f4f4f4 solid; padding: 20px; height: 300px; overflow-y: auto;">
                <div class="shujutitle kflexc" style="margin-bottom: 10px;"><div class="shuxian"></div> 系统更新日志</div>
                <div class="kflexbc" style="align-items: center; padding: 10px; border-bottom: 1px #f4f4f4 solid; font-size: 14px; color: #8A8A8A;" v-for="item in xitonglist" :key="item.id">
                    <div class="kflexc">
                      <div style="margin-right: 20px;">{{item.created_at}}</div>
                      <div style="margin-right: 20px; width: 60px; ">{{item.version}}</div>
                      <div style="margin-right: 20px; max-width: 200px;  overflow: hidden;flex-grow: 1;" >{{item.title}}</div>
                    </div>
                  <div><el-button type="primary" size="mini" @click="go('/xiaoxi/xitongtongzhi?id='+item.id)">查看详情</el-button></div>
                </div>
            </div>
          </div>
          <div class="hei10"></div>
          <div class="tongzhi kflexc" >
            <div>{{moban.platform_name}}余额：<span style="margin-left: 10px; color: #333;  font-size: 16px; margin-right: 20px;font-family: 'shuziyong';">{{yue.qian}}元</span></div>
            <div style="margin-right: 20px;"><el-button type="primary" size="mini" @click="go('/wodezhanghu/wodezhanghu?chongzhi=true')">充值</el-button></div>
            <div style="margin-right: 20px;"><el-button type="danger" size="mini" @click="yujing">预警设置</el-button></div>
            <div style="margin-right: 20px;">短信余额：<span style="margin-left: 10px; color: #333;   font-size: 16px; margin-right: 20px;font-family: 'shuziyong';">{{yue.duanxin}}条</span></div>
            <div><el-button type="primary" size="mini" @click="go('/duanxin/duanxinchongzhi')">充值</el-button></div>
          </div>



          <div class="hei10" ></div>
          <div style="padding: 20px;"  >
            <div class="kflex" style="margin-bottom: 20px;">
              <div class="shujutitle kflexc"><div class="shuxian"></div> 效率工具</div>
              <div style="margin-left: 20px; color: #8A8A8A; font-size: 14px; display: flex; align-items: center;">开通及了解详情请：
                <el-popover placement="bottom" trigger="hover">
                    <div style="text-align: center;">
                      <div>微信扫码咨询{{moban.platform_name}}客服</div>
                      <div><img :src="moban.customer" style="width: 110px;"></div>
                      <div>联系电话：13361324450</div>
                      <div>客服在线时间：工作日8:30-17:00</div>
                    </div>
                    <div slot="reference">
                      <div style="margin-right: 36px; text-align: center; cursor: pointer;">
                        <div style="font-size: 14px; color: #0A82FF;">联系客服</div>
                      </div>
                    </div>
                </el-popover>
              </div>
            </div>
            <div class="gongjulist">
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj1.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">自动生产对接</div>
                  <!-- <div><el-button type="primary" size="mini">查看使用帮助</el-button></div> -->
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">对接运营商接口或上游系统，实现订单的自动提交及回传生 产信息等，需联系客服对接</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj2.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">{{moban.platform_name}}收单接口</div>
                  <div><el-button type="primary" size="mini" @click="goapi" >查看API接口文档</el-button></div>
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">如果您自有系统或者H5下单页，可以通过接口将订单提交 给{{moban.platform_name}}进行后续的订单流转处理</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj3.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">{{moban.platform_name}}商城</div>
                  <!-- <div><el-button type="primary" size="mini">查看使用帮助</el-button></div> -->
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">快速定制生成自己的H5销售页，可以用于抖音快手等直播间 挂载或者广告信息流投放，支持配置自有域名</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj4.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">自动短信沟通用户</div>
                  <div><el-button type="primary" size="mini"  @click="goopen('index/index_duanxin')">了解详情</el-button></div>
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">自动触发短信通知用户，可实现较为复杂的功能，例：接单 后发送上传身份证照片链接、发货后通知运单号</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj5.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">高效外呼系统</div>
                  <div><el-button type="primary" size="mini"  @click="goopen('index/index_waihu')">了解详情</el-button></div>
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">可以起到比短信更好的效果，通过条件筛选需要外呼的对象 支持自动更新任务，标记客户意向等</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj6.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">分销佣金结算</div>
                  <!-- <div><el-button type="primary" size="mini">了解详情</el-button></div> -->
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">提高佣金效率和准确度，按照激活或收入数据自动生成支出 佣金数据，下游确认佣金数据，进入打款流程</div>
              </div>
              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj7.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">单独开发定制</div>
                  <!-- <div><el-button type="primary" size="mini">查看使用帮助</el-button></div> -->
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">依托{{moban.platform_name}}的现有功能基础，可根据您的需求个性化定制， 例如：个性统计，多样化的选号，个性的下单等</div>
              </div>

              <div class="gongjuli">
                <div class="kflexc">
                  <div><img src="../../../static/kuanping/gj8.png" style="margin-right: 10px; width: 30px;"></div>
                  <div style="margin-right: 20px; color: #333; font-weight: bold;">客服知识库</div>
                  <div ><el-button type="primary" size="mini"  @click="goopen('shangpinlist')">进入</el-button></div>
                </div>
                <div style="color: #8A8A8A; margin-top: 25px; line-height: 30px;">行业知识分享、套餐信息备忘、售后处理方案等信息共享 工具，支持关键词搜索</div>
              </div>
            </div>
          </div>


			</div>
		</div>

    <el-dialog title="余额预警额度" center="" :visible.sync="warn_log" width="600px" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-form ref="warn" :model="warn" label-width="140px" @submit.native.prevent>
        <el-form-item label="预警额度:">
          <div class="kflex">
            <div>额度低于</div>
            <div style="margin: 0 10px;"><el-input v-model="warn.warn_value" type="number" style="width: 100px;"></el-input></div>
            <div>自动发送短信提醒</div>
          </div>
        </el-form-item>
        <el-form-item label="发送短信手机号:">
          <el-input v-model="warn.warn_mobile" style="width: 300px;" placeholder="发送短信手机号"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer xinban">
        <el-button type="info" round @click="warn_log = false">取消</el-button>
        <el-button type="primary" round @click="baocunyujing">确定</el-button>
      </span>
    </el-dialog>

		<!-- <foot></foot> -->
    <notice></notice>
	</div>
</template>

<script>
	import axios from 'axios'
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
  import notice from '@/components/notice.vue'
import moment from 'moment'
	export default{
		components: {
			"left": left,
			"top": top,
			"foot": foot,
      "notice": notice
		},
		name: 'index',
		data(){
			return{
        warn_log:false,
        warn:{
          warn_value:"",
          warn_mobile:""
        },
        zhexian:[],
        yue:{
          qian:"",
          duanxin:""
        },
        tongji:{
          today:{
            call_order: 0,
            deliver_count: 0,
            orders_count: 0,
            submit_count: 0,
            success_amount:0
          },
          yesterday:{
            call_order: 0,
            deliver_count: 0,
            orders_count: 0,
            submit_count: 0,
            success_amount:0
          }

        },
        tongjishop:"",
        xitonglist:"",
        yizhoutongji:{
          count:"",
          data:""
        },
        uvlist:"",
        uvlist2:"",
        gonggaolist:[]

			}
		},
		created() {

      this.gettongji()

		},
    mounted() {
      this.zhexiantu()

      localStorage.removeItem("shopConfigInfo")
    },
		methods:{

      baocunyujing:function(){
        axios.post('/api/system/warn/info/update',this.warn)
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.$message.success('编辑成功');
              this.warn_log = false
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})
      },
      yujing:function(){
        axios.get('/api/system/warn/info')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.warn = {
        			  warn_value:response.data.data.warn_value,
        			  warn_mobile:response.data.data.warn_mobile
        			}
              this.warn_log = true
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})
      },
      goapi:function(){
        window.open('https://apifox.com/apidoc/shared-d4dd9241-095d-46a1-8d6e-113f5309be6e')
      },
      golianghao:function(){
        window.open('http://liang.91haoka.cn/web/denglu#reloaded')
      },
      gozhibo:function(){
        var arrstr = document.cookie.split("; ");
        let cookie = ''
        for(var i = 0;i < arrstr.length;i ++){
          var temp = arrstr[i].split("=");
            if(temp[0] == 'laravel_session') {
              cookie = temp[1]
            }
        }
        window.open('http://storep.91haoka.cn/web/zhiboxitong/zhiboxiaoshou?cookie='+cookie)

      },
      go:function(url){
        this.$router.push(url)
      },

      gettongji:function(){
        axios.get('/api/sys/statistics/balance/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
              if(response.data.data.balance==''||response.data.data.balance==null||response.data.data.balance==undefined){
                this.yue.qian = 0
              }else{
        			  this.yue.qian = parseFloat(response.data.data.balance).toFixed(2)
              }
              this.yue.duanxin = response.data.data.message_recharge
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

        axios.get('/api/sys/statistics/order/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
              if(response.data.data != ''){
                this.tongji = response.data.data
              }

        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

        axios.get('/api/sys/statistics/shop/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.tongjishop = response.data.data
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

        axios.get('/api/sys/statistics/market/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.uvlist = response.data.data
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

        axios.get('/api/sys/statistics/merchant/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.uvlist2 = response.data.data
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

        axios.get('/api/sys/statistics/version/log')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.xitonglist = response.data.data
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})
        axios.get('/api/sys/statistics/notice')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {
        			this.gonggaolist = response.data.data.data
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

      },

      zhexiantu: function() {

        axios.get('/api/sys/statistics/week/count')
        	.then(response => {
        		if (response && response.data.msg.code == 0) {

              this.yizhoutongji = response.data.data

              let item = this.yizhoutongji.data

        			var chartDom = document.getElementById('main2');
        			var myChart = this.$echarts.init(chartDom);
        			var option;

        			let d = []
        			let n = []
              if(this.yizhoutongji && this.yizhoutongji.data){
                this.yizhoutongji.data.forEach(item=>{
                  d.push(item.orders_count)
                  n.push(item.deliver_count)
                })
              }

        			option = {
        			  color:['#EEF7FF','#0A82FF'],
        			  grid: {
        			    left: '3%',
        			    right: '3%',
        			    bottom: '1%',
        			    top: '5%',
        			    containLabel: true
        			  },
                title: {
        			     text: ''
        			   },
        			   tooltip: {
        			     trigger: 'axis'
        			   },
        			  xAxis: {
        			      type: 'category',

        			      data: [
                      moment().subtract(7, 'days').format('M.D'),
                      moment().subtract(6, 'days').format('M.D'),
                      moment().subtract(5, 'days').format('M.D'),
                      moment().subtract(4, 'days').format('M.D'),
                      moment().subtract(3, 'days').format('M.D'),
                      moment().subtract(2, 'days').format('M.D'),
                      moment().subtract(1, 'days').format('M.D')
                    ]
        			    },
        			    yAxis: {
        			      type: 'value'
        			    },
                  series: [
                    {
                      name: '发展订单数',
                      type: 'line',
                      lineStyle:{
                        width:1
                      },
                      data: d,
                      smooth: true

                    },
                    {
                      name: '发货数',
                      type: 'line',
                      lineStyle:{
                        width:1
                      },
                      data: n,
                      smooth: true

                    }
                  ]
        			};

        			option && myChart.setOption(option);
        		} else {
        			if(response){
        			  this.$message.error(response.data.msg.info);
        			}
        		}
        	})

      },
		}
	}
</script>

<style lang="scss" scoped >
	.index{ background: #F4F4F4;
    .xinban /deep/ .el-button--primary {
        color: #FFF;
        background-color: #2974FF;
        border-color: #2974FF;
    }
		.center{ width: 100%; margin: 0 auto; display: flex; justify-content: space-between; background: #F4F4F4;
      .left{ width: 200px; height: 100vh; overflow-y: auto;}
			.right{ width: calc(100% - 210px); height: 100vh; overflow-y: auto;



        .flex{ display: flex;}
        .flexc{ display: flex; align-items: center;}
        .tongzhi{padding: 10px 25px; background: #fff; color: #595959; font-size: 14px;}
        .shujutitle{ color: #333; font-weight: bold; font-size: 16px;}
        .shuxian{ width:3px; height: 15px; background: linear-gradient(180deg, #FF6836 0%, #FF2D9D 100%); margin-right: 10px;}
        .shuju{  padding: 20px; background: #fff; flex:11;



          @media (max-width: 1800px) {
          	.shujuli{ margin-top: 50px; width: 50%; padding-left: 50px; box-sizing: border-box;
          	  .shujuliimg{ margin-right: 30px;
          	    img{width: 70px; }
          	  }
          	}
          }
          @media (min-width: 1800px) {
          	.shujuli{ margin: 50px 0;
          	  .shujuliimg{ margin-right: 30px;
          	    img{width: 70px; }
          	  }
          	}
          }

        }
        .zi1{color: #8A8A8A; font-size: 14px;}
        .zi3{color: #8A8A8A; font-size: 14px;}
        .zi2{color: #333; font-size: 25px; margin: 5px 0;   font-family: 'shuziyong';}
        .shuju2{ flex: 3; border-left: 10px #F4F4F4 solid; padding: 20px; }
        .gongjulist{ display: flex; flex-wrap: wrap;
          .gongjuli{ border: 1px #F4F4F4 solid; border-radius: 8px; padding: 20px; width: 21%; margin: 1% 0; min-width: 320px; margin-right: 21px;}
        }
			}
		}
		.result{ margin-top: 20px;}
    /deep/ .el-button--primary{ background: rgba(10,130,255,0.1); color: #0A82FF; border: 0;}
    /deep/ .el-button--danger{ background: rgba(245,108,108,0.1); color: #EEF7FF; border: 0;}
    /deep/ .el-collapse-item__header{ font-size: 14px !important;}

	}
</style>
